<?php defined('IN_YuLin') || exit('NO PERMIT!'); ?>
{template header}
	<div id="app">
       	<header class="top">
        	<span>全部彩种</span> 
    		<a href="/wap.php" class="iconfont back" style=""></a> 
       	</header> 
       	<div data-v-01ab8554="" class="main" s="[object Object]">
            <div data-v-01ab8554="" class="nav-top-pos">
             	<div data-v-01ab8554="" class="nav-top">
                  	<ul data-v-01ab8554="" class="tag_lottery_cate">
                       	<li data-v-01ab8554="" class="tag_cate on" onclick="chooseLotteryCate(this, '')">
                       		<a data-v-01ab8554="">
                       			<i data-v-01ab8554="" class="A_ALL"></i> 
                       			<p data-v-01ab8554="">全部彩种</p>
                   			</a>
               			</li>
               			{loop $cateIdKey as $lck => $lcv}
               				<li data-v-01ab8554="" class="tag_cate " onclick="chooseLotteryCate(this, {$lcv['id']})">
               					<a data-v-01ab8554="">
               						<i data-v-01ab8554="" class="A_{$lcv['ptid']}"></i> 
               						<p data-v-01ab8554="">{$lcv['name']}</p>
           						</a>
       						</li>
               			{/loop}
                  	</ul>
             	</div>
            </div> 
            <div data-v-01ab8554="" id="HotLottery" style="height: 35em;">
             	<ul data-v-01ab8554="">
             		{loop $lottery as $lk => $lv}
                  		<li data-v-01ab8554="" name="cate_{$lv['cate_id']}" class="tag_lottery_item type_{$lv['cate_id']}">
                  			<a data-v-01ab8554="" href="{U('lottery/betting', array('id' => $lv['id']))}" class="active {$cateIdKey[$lv['cate_id']]['tags']}">
                  				<p data-v-01ab8554="">{$lv['title']}</p> 
                  				<span data-v-01ab8554="">{$lv['per_explain']}</span>
                  			</a>
                  		</li>
              		{/loop}
              		<li data-v-01ab8554=""></li>
             	</ul>
            </div>
       	</div> 
      </div>
        <script>
        	/**
         	 * 选择彩种 
        	 */
        	//初始化的时候默认显示所有彩种添加样式
        	$('.tag_lottery_item').each(function(index){
        		$(this).addClass("border");
        		if((index+1)%3==0){
        			$(this).addClass("border-right");
        		}
        	})
        	//点击切换彩种
        	function chooseLotteryCate(obj, cate_id){
        		//移除所有样式
        		$('.tag_lottery_item').removeClass("border");
        		$('.tag_lottery_item').removeClass("border-right");
        		// 改变分类的选择样式
        		$('.tag_cate').removeClass('on');
        		$(obj).addClass('on');
        		// 检查是否有选择分类
        		if(!cate_id){
        			// 显示所有彩种
        			$('.tag_lottery_item').each(function(index){
        				$(this).show();
		        		$(this).addClass("border");
		        		if((index+1)%3==0){
		        			console.log(1111)
		        			$(this).addClass("border-right");
		        		}
		        	})
        			return;
        		}
        		// 根据传递的分类，隐藏其他分类
        		$('.tag_lottery_item').hide();
    			$('.type_'+cate_id).each(function(index,item){
        			$(this).show();
        			$(this).addClass("border");
        			if((index+1)%3==0){
	        			$(this).addClass("border-right");
	        		}
    			})

        		
//      		var showList     = document.getElementsByName(showItemName);
//      		for(var i = 0; i < showList.length; i++){
//      			showList[i].style.display = 'block';
//      		}
        	}
        </script>
    {template footer}
</html>